<template>
	<view class="pagebox">
	
		<view class="listbox">
			<view class="line" v-for="(item,index) in list " :key="index">
				<view class="receive" v-if="item.type==1">
					<view class="imagebox">
						<image src="https://changban.dianjingkeji.net/img/微信图片_20250923172704_692_133.jpg" mode=""></image>
					</view>
					<view class="msgbox">
						<view class="name">
							{{item.name}}主任专家团队
						</view>
						<view class="msg">
							{{item.content}}
						</view>
					</view>
				</view>
			
			
			<view class="send" v-if="item.type==0">
				<view class="msgbox">
					<image :src="'https://changban.dianjingkeji.net/prod-api'+item.content"></image>
				</view>
				<view class="imagebox">
					<image :src="'https://changban.dianjingkeji.net/prod-api'+item.touxiang" @click="lookimage(item.touxiang)"></image>
				</view>
			</view>
			</view>
		</view>
		<view class="putbox">
			<view class="iconfont icon-shengyinkai">
				
			</view>
			<input type="text" placeholder="请输入" />
			<view class="upbtn">
				+
			</view>
		</view>
		<view class="bannerbox">
			<view class="itembanner" @click="paizhao">
				<view class="yuanbox">
					<view class="iconfont icon-post_pic">
						
					</view>
				</view>
				<view class="bannername">
					拍照
				</view>
			</view>
			<view class="itembanner" @click="xiangce">
				<view class="yuanbox">
					<view class="iconfont icon-tupian">
						
					</view>
				</view>
				<view class="bannername">
					上传图片
				</view>
			</view>
			<view class="itembanner">
				<view class="yuanbox">
					<view class="iconfont icon-wenjianjia">
						
					</view>
				</view>
				<view class="bannername">
					文件上传
				</view>
			</view>
			<view class="itembanner">
				<view class="yuanbox">
					<view class="iconfont icon-dianhua">
						
					</view>
				</view>
				<view class="bannername">
					语音通话
				</view>
			</view>
		</view>
		<view class="footline">
			<view class="iconbox" @click="winshow=true">
				<view class="iconfont icon-fenxiang1">
					
				</view>
				<view class="name" >
					分享
				</view>
			</view>
	
			
		</view>
		
		
	</view>
</template>

<script>
	import {medicalOrderUpload,getTeamLeader} from '../../utils/api.js'
	export default {
		data() {
			return {
				winshow:false,
				list:[]
			}
		},
		onShow() {
			
			// let a={
			// 		phone:uni.getStorageSync('phone')
			// }
			// getTeamLeader(a).then(res=>{
			// 	console.log(res)
			// 	this.doctor=res.data.data.teamLeader
				this.list.push(
					{
						touxiang:res.data.data.teamLeader.dAvatarUrl,
						name:res.data.data.teamLeader.dName,
						user:1,
						type:1,
						content:'你好，在这里需要上传您的出院小结或医嘱图片、pdf文件，专属6X专家团队将在24小时内为您制定详细的医嘱执行方案，您可以阅读，也可以收听播客语音；并进一步为您生成6个阶段13周共91天的阶段性具体执行计划，涵盖医护专家团队的随访行动和您的每周、每日的具体任务清单。'
					}
				)
			// })
		},
		methods: {
			paizhao(){
				let that=this
				uni.chooseImage({
					count: 1, 
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['camera'], //直接拍照
					success: function (res) {
						
						let url=res.tempFilePaths[0]
						uni.uploadFile({
									//url: 'http://192.168.10.93:8989/api/commonApi/uploadFile', 
									url: 'https://changban.dianjingkeji.net/prod-api/api/commonApi/uploadFile', 
									filePath: url,
									name: 'file',
									success: (uploadFileRes) => {
										
										let p={
											phone:uni.getStorageSync('phone'),
											fileUrl:JSON.parse(uploadFileRes.data).fileName
										}
										
									    let imgurl=JSON.parse(uploadFileRes.data).fileName
										medicalOrderUpload(p).then(res=>{
											
											if(res.data.code==200){
												that.list.push({
													touxiang:'',
													name:'',
													user:0,
													type:0,
													content:imgurl
												},
												{
													touxiang:'',
													name:that.doctor.dName,
													user:1,
													type:1,
													content:'方案将在24小时内生成，请稍后。。。'
												})
												console.log(that)
											}else{
												uni.showModal({
													title: '提示',
													content: res.data.msg,
													success: function (res) {
														if (res.confirm) {
															uni.navigateTo({
																url:'/pagesB/myinfo/myinfo'
															})
														} else if (res.cancel) {
															console.log('用户点击取消');
														}
													}
												});

											}
										})
									},
									 fail: (err) => {
									        console.error('上传失败：', err);
									      }
									
								});
					}
				});
			},
			xiangce(){
				let that=this
				uni.chooseImage({
					count: 1, 
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //直接拍照
					success: function (res) {
						
						let url=res.tempFilePaths[0]
						uni.uploadFile({
									//url: 'http://192.168.10.93:8989/api/commonApi/uploadFile', 
									url: 'https://changban.dianjingkeji.net/prod-api/api/commonApi/uploadFile',
									filePath: url,
									name: 'file',
									success: (uploadFileRes) => {
										
										let p={
											phone:uni.getStorageSync('phone'),
											fileUrl:JSON.parse(uploadFileRes.data).fileName
										}
										
									    let imgurl=JSON.parse(uploadFileRes.data).fileName
										medicalOrderUpload(p).then(res=>{
											
											if(res.data.code==200){
												that.list.push({
													touxiang:'',
													name:'',
													user:0,
													type:0,
													content:imgurl
												},
												{
													touxiang:'',
													name:that.doctor.dName,
													user:1,
													type:1,
													content:'方案将在24小时内生成，请稍后。。。'
												})
												console.log(that)
											}else{
												uni.showModal({
													title: '提示',
													content: res.data.msg,
													success: function (res) {
														if (res.confirm) {
															uni.navigateTo({
																url:'/pagesB/myinfo/myinfo'
															})
														} else if (res.cancel) {
															console.log('用户点击取消');
														}
													}
												});

											}
										})
									},
									 fail: (err) => {
									        console.error('上传失败：', err);
									      }
									
								});
					}
				});
			},
			lookimage(e) {
			  const imageUrl = e; // 假设 e 是图片的相对路径，如：/upload/xxx.jpg
			
			  // 1. 拼接完整 URL
			  const fullUrl = 'https://changban.dianjingkeji.net/prod-api' + imageUrl;
			
			  // 2. urls 数组支持多图预览（即使现在只传一张）
			  const urls = [fullUrl];
			
			  uni.previewImage({
			    urls: urls,
			    // 当前显示的图片索引（如果有多张图时有用）
			    current: fullUrl,
			    longPressActions: {
			      itemList: ['发送给朋友', '保存图片', '收藏'],
			      success: function(data) {
			        console.log('长按操作：选中了第' + (data.tapIndex + 1) + '个按钮');
			        console.log('当前查看的是第' + (data.index + 1) + '张图片');
			      },
			      fail: function(err) {
			        // 用户取消也算 fail，需判断
			        if (err.errMsg !== 'previewImage:fail cancel') {
			          console.error('预览图片失败：', err.errMsg);
			        }
			      }
			    }
			  });
			}
		}
	}
</script>

<style lang="less" scoped>
 .pagebox{
	 width: 750rpx;
	 box-sizing: border-box;
	 background-color: #f1f1f1;
	 padding-bottom: 120rpx;

	 .listbox{
		 width: 100%;
		max-height: 70vh;
		min-height: 70vh;
		 background-color: whitesmoke;
		 box-sizing: border-box;
		 padding: 20rpx;
		 overflow-y: auto;
		 .line{
			 width: 100%;
			
		 }
		 .receive{
			 width: 85%;
			 display: flex;
			 
			 align-items: flex-start;
			  margin-top: 20rpx;
			 .imagebox{
				 width: 80rpx;
				 min-width: 80rpx;
				 height: 80rpx;
				 min-height: 80rpx;
				 border-radius: 40rpx;
				 image{
					 width: 100%;
					 height: 100%;
					  border-radius: 35rpx;
				 }
			 }
			 .msgbox{
				 margin-left: 20rpx;
				 image{
					 width: 300rpx;
					 height: 200rpx;
					 border-radius: 20rpx;
					 border: 10rpx solid #1a4f8a;
					 
				 }
				 
				 .name{
					 font-size: 28rpx;
					 color: #898989 ;
				 }
				 .msg{
					 background-color: white;
					 font-size: 30rpx;
					 padding: 10rpx;
					 border-radius: 16rpx;
				 }
			 }
		 }
		 .send{
		 			 width: 85%;
		 			 display: flex;
		 			 align-items: flex-start;
					 justify-content: flex-end;
					 margin-top: 20rpx;
					 margin-left: 14%;
					
		 			 .imagebox{
		 				 width: 80rpx;
		 				 height: 80rpx;
		 				 border-radius: 40rpx;
						
		 				 image{
		 					 width: 100%;
		 					 height: 100%;
		 					  border-radius: 35rpx;
		 				 }
		 			 }
		 			 .msgbox{
		 				 margin-right: 20rpx;
		 				 image{
		 				 					 width: 300rpx;
		 				 					 height: 200rpx;
		 				 					 border-radius: 20rpx;
		 				 					 border: 10rpx solid #1a4f8a;
		 				 					 
		 				 }
		 				 .name{
		 					 font-size: 28rpx;
		 					 color: #898989 ;
		 				 }
		 				 .msg{
		 					 background-color: white;
		 					 font-size: 30rpx;
		 					 padding: 10rpx;
		 					 border-radius: 16rpx;
		 				 }
		 			 }
		 }
	 }
	 .putbox{
		width: 100%;
		box-sizing: border-box;
		padding: 20rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		line-height: 50rpx;
		.iconfont{
			width: 50rpx;
			height: 50rpx;
		}
		input{
			background-color: white;
			width: 82%;
			height: 60rpx;
			padding: 2rpx 10rpx;
		}
		
		.upbtn{
			width: 60rpx;
			height: 60rpx;
			border-radius: 50%;
			text-align: center;
			line-height: 60rpx;
			font-size: 40rpx;
			background-color: white;
		}
	 }
	 .bannerbox{
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-evenly;
		height: 200rpx;
		.itembanner{
			width: 25%;
			text-align: center;
			.yuanbox{
				width: 120rpx;
				height: 120rpx;
				border-radius: 40rpx;
				background-color: white;
				text-align: center;
				margin: auto;
				margin-bottom: 20rpx;
				line-height: 120rpx;
				.iconfont{
					font-size: 60rpx;
					color: #1a4f8a;
				}
			}
		}
	 }
	 .footline{
		 width: 100%;
		 height: 120rpx;
		 background-color: white;
		 position: fixed;
		 left: 0;
		 bottom: 0;
		 display: flex;
		 align-items: center;
		 justify-content: space-evenly;
		 .iconbox{
			 text-align: center;
			 font-size: 28rpx;
			 .iconfont{
				 margin: auto;
				 font-size: 50rpx;
				 
			 }
		 }
		
	 }
	
 }
</style>
